{extend name="base"}
{block name="content"}
<link rel="stylesheet" href="/static/merchant/pc/css/store_set.css">
<style>
.Switch{
    float: none !important;
    margin: 0 auto;
    width: 108px;		
}
.Switch input {
	display: none
}

.Switch label {
	background: #CCC;
	height: 28px;
	width: 98px;
	border-radius: 14px;
	float: right;
	margin: 8px 10px 0 0;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .1) inset;
	position: relative;
}

.Switch label em {
	width: 26px;
	height: 26px;
	float: left;
	margin: 1px;
	border-radius: 13px;
	box-shadow: 2px 3px 8px rgba(0, 0, 0, .1);
	background: #FFF;
	transition: 0.1s;
}
.Switch label span {
	position: absolute;
	left: 36px;
	height: 28px;
	line-height: 28px;
	color: #6E6B6B;
}	

.Switch input:checked+label {
	background: #a4d714;
}

.Switch input:checked+label span {
	color: #fff;
	left: 15px;
}

.Switch input:checked+label em {
	margin: 1px 1px 1px 71px;
}

.Switch input:disabled+label {
	opacity: 0.5
}

</style>
<div class="main_div">
						<div class="ty_box goods_category">
							<div class="d_ty_head">
								<b class="e_d_t_title">商品分类<span>Classification</span></b>
							</div>
								<div class="ty_b_add add_category">
									<i class="iconfont icon-plus"></i>添加分类
								</div>
							<ul class="ty_b_list">
								<li class="ty_l_head">
									<div class="ty_l_d3" style="width: 20%">分类名称</div>
									<div class="ty_l_d3" style="width: 20%">排序（值越大越排前）</div>
									<div class="ty_l_d3" style="width: 20%">状态</div>
									<div class="ty_l_d3" style="width: 20%">创建时间</div>
									<div class="ty_l_d3" style="width: 20%">操作</div>
								</li>
								{foreach $categorys as $v}
								<li class="ty_l_li">
									<div class="ty_l_d3" style="width: 20%">{$v.name}</div>
									<div class="ty_l_d3" style="width: 20%">{$v.sort}</div>
									<div class="ty_l_d3" style="width: 20%">
									 <div class="Switch">
										<input type="checkbox"  value="change_status" name="notices_{$v.id}" id="change_status_{$v.id}" {if $v.status == 1}checked{/if} ><label for="change_status_{$v.id}" data-id="{$v.id}"><span>{if $v.status == 1}已开启{else/}已关闭{/if}</span><em></em></label>
									</div>
									</div>
									<div class="ty_l_d3" style="width: 20%">{$v.create_at|date="Y-m-d H:i:s",###}</div>
									<div class="ty_l_d3" style="width: 20%">
									<a class="ty_l_btn"  href="{:url('link')}?id={$v.id}">链接</a>
									<a class="ty_l_btn"  href="{:url('goods/index')}?cate_id={$v.id}">商品</a>
									<a class="ty_l_btn"  href="{:url('goods_card/index')}?cate_id={$v.id}">库存卡</a>
									<a class="ty_l_btn"  href="{:url('edit')}?id={$v.id}">编辑</a>
									<a class="ty_l_btn ty_l_delete delbtn"  href="javascript:void(0);" data-id="{$v.id}">删除</a>
										
									</div>
								</li>
								{/foreach}
								</ul>
							
						</div>
					</div>
<div class="modals_box exportDiv" style="display: none;">
		<div class="modals_main">
			<div class="modals_newDiv">
				<div class="modals_newContent">
					<div class="modals_newPar">
						<div class="new_title">添加分类</div>
						<div class="new_content">
							<form method="post" id="ajaxform" action="{:url('add')}">
							<div class="e_content">
								<dl>
									<dt class="e_title">分类名称</dt>
									<dd class="e_input"><input type="text" name="name"></dd>
								</dl>
								<dl>
									<dt class="e_title">排序</dt>
									<dd class="e_input"><input type="text" name="sort" value="0"></dd>
								</dl>
								<dl>
									<dt class="e_title">&nbsp;</dt>
									<dd class="e_input" onclick="submitform();return false;"><span class="btn_confirm">确认</span></dd>
								</dl>
							</div>
							</form>
							<div class="e_footer">
								<dl>
									<dt class="e_title">功能说明</dt>
									<dd class="e_text">
										1、排序数值越小，排位越靠前，如：排序99的会在排序100之上</dd>
									<dd class="e_text">
										2、在购买页面的商品分类列表会以此排序
									</dd>
								</dl>
							</div>
							
						</div>
					</div>
				</div>
				<div class="modals_shade"></div>
			</div>
		</div>
	</div>

	<script>
        function submitform() {
                $("#ajaxform").submit();
        }
		
	</script>
	
	<script>
     $(function(){
		 $(".Switch label").click(function(){
			 var ajax_status=1;
			if(ajax_status==1){
			var id=$(this).data("id");
			 var intxt=$(this).siblings("input").prop('checked');
			 
			 if(intxt){
				$(this).children("span").html("已关闭");
				var status=0;
			 }else{
				$(this).children("span").html("已开启");
				var status=1;
			 }
			
				 
			 $.post('/merchant/goods_category/changeStatus',{id:id,status:status},function(res){
				 ajax_status=0;
				if(res.code!=0){
					layer.msg(res.msg, {time: 1000, icon: 5});
				}else{	
					layer.msg("操作成功", {time: 1000, icon: 6});
				 }
			  });
			}else{
				layer.msg("操作太快了，请放慢一点", {time: 1000, icon: 5});
			}
		 });
		 $('.add_category').click(function () {
				$('.exportDiv').fadeIn(200);
			});
		$('.modals_shade').click(function () {
				$('.exportDiv').fadeOut(0);
				// c_input();
				// console.log('取消');
			}); 
		$(".delbtn").click(function(){
			var id=$(this).data("id");
			layer.open({
                content: "确定删除吗？你将无法恢复该操作！",
                btn: ['确定', '取消'],
                shadeClose: false,
                yes: function(){
					$.post('/merchant/goods_category/del',{
						id:id
					},function(res){
						if(res.code!=0){
							layer.msg(res.msg, {time: 1000, icon: 5});
						}else{
							
							layer.msg("删除成功", {time: 1000, icon: 6}, function () {
								location.reload();
							});
						}
					});
				}
            });
		})
	});
	</script>
{/block}